<script>
import RegisterList from "@/views/business/doctor/RegisterList";
import ChooiceCheckItems from "./ChooiceCheckItems";
import ChooiceInspectItems from "./ChooiceInspectItems";
import CheckApplyDetail from '@/views/business/medical_technology/check_apply_detail.vue'
import InspectApplyDetail from '@/views/business/medical_technology/inspect_apply_detail.vue'

import {receivePatient, saveCheckAppy, saveInspectApply, queryApplyItem} from "@/api/doctor/doctor"

export default {
  name: 'DoctorHome',
  components: {
    RegisterList,
    ChooiceCheckItems,
    ChooiceInspectItems,
    CheckApplyDetail,
    InspectApplyDetail
  },
  data() {
    return {
      visable: false,
      visable1: false,
      checkItemId: null,
      inspectItemId: null,
      activeName: 'first',
      activeName2: 'deal',
      register: {},
      form: {},
      visiableChooiceCheckItems: false,
      visiableChooiceInspectItems: false,
      checkItems: [],
      inspectItems: [],
      saveSelectedCheckList: [],//选择需要保存的 检查项目
      saveSelectedInspectList: []//选择需要保存的 检验项目
    }
  },
  methods: {

    saveSelectAble(row, index) {
      return !row.status;
    },
    //保存检查申请
    saveCheckApply() {
      //当前的患者id，
      //需要提交的检查项目ids
      const checkItemIds = this.saveSelectedCheckList.map(item => {
        return item.checkId
      });


      let data = {
        registId: this.form.registId,
        checkItemIds: checkItemIds
      }


      //{  [  ]  }
      saveCheckAppy({paramstr: encodeURI(JSON.stringify(data))}).then(res => {
        if (res) {
          //刷新左侧
          this.queryApplyItem();
          // this.$router.go(0);
          //this.$store.dispatch('refreshLeft')
          this.$message.success('保存成功')
        } else {
          this.$message.error('保存失败')
        }
      })

    },

    //保存检查申请
    saveInspectApply() {
      //当前的患者id，
      //需要提交的检验项目ids
      const inspectItemIds = this.saveSelectedInspectList.map(item => {
        return item.inspectId
      });


      let data = {
        registId: this.form.registId,
        inspectItemIds: inspectItemIds
      }


      //{  [  ]  }
      saveInspectApply({paramstr: encodeURI(JSON.stringify(data))}).then(res => {
        if (res) {
          //刷新左侧
          // this.$router.go(0);
          //this.$store.dispatch('refreshLeft')
          this.queryApplyItem();
          this.$message.success('保存成功')
        } else {
          this.$message.error('保存失败')
        }
      })

    },
    listenerSelectCheckItem(selection, row) {
      this.saveSelectedCheckList = selection;
    },
    listenerSelectInspectItem(selection, row) {
      this.saveSelectedInspectList = selection;
    },
    //监听申请检查 页面选择的项目
    selectCheckItem(items) {
      items.forEach(item => {
        this.checkItems.push(item)
      })
    },
    //监听申请检查 页面选择的项目
    selectInspectItem(items) {
      items.forEach(item => {
        this.inspectItems.push(item)
      })
    },
    //切换门诊病例、检查申请、检验申请之前，校验是否选择患者
    beforeLeave(activeName, oldActiveName) {
      if (activeName !== 'deal') {
        if (!this.form.registId) {
          this.$message.warning('请选择患者')
          return false;
        }
      }

      return true;
    },
    selectRegist(register) {
      this.register = register
      this.form.registId = this.register.registId;
      //查询已经申请的检查、检验项目
      this.queryApplyItem();
    },
    queryApplyItem() {
      queryApplyItem(this.form.registId).then(res => {

        /**
         * res.put("checkItems",checkItems);
         *         res.put("checkItems",inspectItems);
         */
        this.checkItems = res.checkItems;
        this.inspectItems = res.inspectItems;
      })
    },
    saveRegistger() {

      if (this.form.registId) {
        //接诊操作，保存，主诉，现病史 药品....
        receivePatient(this.form).then(res => {
          if (res) {
            //刷新左侧
            this.$router.go(0);
            //this.$store.dispatch('refreshLeft')
            this.$message.success('保存成功')
          } else {
            this.$message.error('保存失败')
          }
        })
      } else {
        this.$message.warning('请选择患者')
      }


    },
    showCheckDetail(checkItemId) {

      this.checkItemId = checkItemId;
      this.visable = true;
    },
    showInspectDetail(inspectItemId){
      this.inspectItemId = inspectItemId;
      this.visable1 = true;
    }
  }
}


</script>
<template>
  <div>
    <el-row>
      <el-col :span="6" class="splitRow">

        <el-tabs v-model="activeName">
          <el-tab-pane label="本人" name="first">
            <RegisterList type="personal" @selectRegist="selectRegist"></RegisterList>

          </el-tab-pane>
          <el-tab-pane label="科室" name="second">
            <RegisterList type="dept" @selectRegist="selectRegist"></RegisterList>
          </el-tab-pane>
        </el-tabs>
      </el-col>
      <el-col :span="18" class="splitRow">


        <el-tabs v-model="activeName2" :before-leave="beforeLeave">
          <el-tab-pane label="门诊首页" name="deal">
            <div>患者姓名: {{ register.name }} 年龄:{{ register.age }}</div>
            <div style="margin-bottom: 10px">

              <el-row>

                <el-col :span="20">
                  <el-button type="primary" size="mini" @click="saveRegistger">提交</el-button>
                </el-col>
              </el-row>
            </div>


            <el-form ref="form" :model="form" label-width="150px">
              <el-form-item label="主诉" prop="readme">
                <el-input v-model="form.readme" type="textarea" placeholder="请输入内容"/>
              </el-form-item>
              <el-form-item label="现病史" prop="present">
                <el-input v-model="form.present" type="textarea" placeholder="请输入内容"/>
              </el-form-item>
              <el-form-item label="现病史治疗情况" prop="presentTreat">
                <el-input v-model="form.presentTreat" type="textarea" placeholder="请输入内容"/>
              </el-form-item>
              <el-form-item label="既往史" prop="history">
                <el-input v-model="form.history" type="textarea" placeholder="请输入内容"/>
              </el-form-item>
              <el-form-item label="过敏史" prop="allergy">
                <el-input v-model="form.allergy" type="textarea" placeholder="请输入内容"/>
              </el-form-item>
              <el-form-item label="确诊疾病" prop="disease">
                <el-input v-model="form.disease" type="textarea" placeholder="请输入内容"/>
              </el-form-item>
              <el-form-item label="处置方案" prop="suit">
                <el-input v-model="form.suit" type="textarea" placeholder="请输入内容"/>
              </el-form-item>
              <el-form-item label="药品清单" prop="drug">
                <el-input v-model="form.drug" type="textarea" placeholder="请输入内容"/>
              </el-form-item>
            </el-form>


          </el-tab-pane>
          <el-tab-pane label="检查申请" name="check">
            <div>患者姓名: {{ register.name }} 年龄:{{ register.age }}</div>
            <el-button @click="visiableChooiceCheckItems=true" size="mini">检查申请</el-button>
            <el-button @click="saveCheckApply" type="primary" size="mini">提交</el-button>


            <el-dialog :visible.sync="visiableChooiceCheckItems">
              <ChooiceCheckItems @selectCheckItem="selectCheckItem"
                                 :visible.sync="visiableChooiceCheckItems"></ChooiceCheckItems>
            </el-dialog>


            <el-table :data="checkItems" @select="listenerSelectCheckItem">
              <el-table-column type="selection" width="55" :selectable="saveSelectAble"></el-table-column>
              <!--                <el-table-column  type="index" label="序号" width="280"  align="center"></el-table-column>-->
              <el-table-column prop="name" label="检查名称" align="center"></el-table-column>
              <el-table-column prop="price" label="价格" align="center"></el-table-column>
              <el-table-column prop="status" label="状态" align="center">
                <template slot-scope="scope">

                  <el-tag v-if="scope.row.status==1" type="danger">
                    待缴费
                  </el-tag>
                  <el-tag v-else-if="scope.row.status==2" type="success">
                    已缴费
                  </el-tag>
                  <el-tag v-else-if="scope.row.status==3" type="warning">
                    退费
                  </el-tag>
                  <el-tag v-else-if="scope.row.status==4" type="info">
                    已完成
                  </el-tag>

                  <el-tag v-else>
                    待提交
                  </el-tag>
                </template>

              </el-table-column>
              <el-table-column prop="status" label="操作" align="center">
                <template slot-scope="scope">
                  <el-button v-if="scope.row.status==4" type="success" size="mini"  @click="showCheckDetail(scope.row.itemId)">  详情
                  </el-button>
                </template>
              </el-table-column>


            </el-table>


          </el-tab-pane>
          <el-tab-pane label="检验申请" name="inspect">


            <div>患者姓名: {{ register.name }} 年龄:{{ register.age }}</div>
            <el-button @click="visiableChooiceInspectItems=true" size="mini">检验申请</el-button>
            <el-button @click="saveInspectApply" type="primary" size="mini">提交</el-button>


            <el-dialog :visible.sync="visiableChooiceInspectItems">
              <ChooiceInspectItems @selectInspectItem="selectInspectItem"
                                   :visible.sync="visiableChooiceInspectItems"></ChooiceInspectItems>
            </el-dialog>


            <el-table :data="inspectItems" @select="listenerSelectInspectItem">
              <el-table-column type="selection" width="55" :selectable="saveSelectAble"></el-table-column>
              <!--                <el-table-column  type="index" label="序号" width="280"  align="center"></el-table-column>-->
              <el-table-column prop="name" label="检验名称" align="center"></el-table-column>
              <el-table-column prop="price" label="价格" align="center"></el-table-column>
              <el-table-column prop="status" label="状态" align="center">
                <template slot-scope="scope">

                  <el-tag v-if="scope.row.status==1" type="danger">
                    待缴费
                  </el-tag>
                  <el-tag v-else-if="scope.row.status==2" type="success">
                    已缴费
                  </el-tag>
                  <el-tag v-else-if="scope.row.status==3" type="warning">
                    退费
                  </el-tag>
                  <el-tag v-else-if="scope.row.status==4" type="info">
                    已完成
                  </el-tag>

                  <el-tag v-else>
                    待提交
                  </el-tag>
                </template>

              </el-table-column>

              <el-table-column prop="status" label="操作" align="center">
                <template slot-scope="scope">
                  <el-button v-if="scope.row.status==4" type="success" size="mini"  @click="showInspectDetail(scope.row.itemId)">  详情
                  </el-button>
                </template>
              </el-table-column>
            </el-table>


          </el-tab-pane>
        </el-tabs>


      </el-col>

    </el-row>


    <el-dialog :visible.sync="visable" title="项目详情">
      <CheckApplyDetail :visible.sync="visable" v-if="visable" :itemId="checkItemId" type="show"></CheckApplyDetail>
    </el-dialog>

    <el-dialog :visible.sync="visable1" title="项目详情">

      <InspectApplyDetail :visible.sync="visable1" v-if="visable1" :itemId="inspectItemId" type="show"></InspectApplyDetail>
    </el-dialog>


  </div>


</template>

<style scoped>
.splitRow {
  padding: 20px;
}
</style>

